@page "/register"
@using System.ComponentModel.DataAnnotations
@using BlazorWasmAuth.Identity
@using BlazorWasmAuth.Identity.Models
@inject IAccountManagement Acct

<PageTitle>Register</PageTitle>

<h1>Register</h1>

<AuthorizeView>
    <Authorized>
        <div class="alert alert-success">You're already logged in as @context.User.Identity?.Name.</div>
    </Authorized>
    <NotAuthorized>
        @if (formResult.Succeeded)
        {
            <div class="alert alert-success">
                You successfully registered. Now you can <a href="login">login</a>.
            </div>
        }
        else
        {
            @foreach (var error in formResult.ErrorList)
            {
                <div class="alert alert-danger">@error</div>
            }
            <div class="row">
                <div class="col">
                    <section>
                        <EditForm Model="Input" method="post" OnValidSubmit="RegisterUserAsync"
                                  FormName="register" Context="editform_context">
                            <DataAnnotationsValidator />
                            <h2>Register as a new user.</h2>
                            <hr />
                            <div class="form-floating mb-3">
                                <InputText @bind-Value="Input.Email"
                                           id="Input.Email"
                                           class="form-control"
                                           autocomplete="username"
                                           aria-required="true"
                                           placeholder="name@example.com" />
                                <label for="Input.Email" class="form-label">
                                    Email
                                </label>
                                <ValidationMessage For="() => Input.Email"
                                                   class="text-danger" />
                            </div>
                            <div class="form-floating mb-3">
                                <InputText type="password"
                                           @bind-Value="Input.Password"
                                           id="Input.Password"
                                           class="form-control"
                                           autocomplete="new-password"
                                           aria-required="true"
                                           placeholder="password" />
                                <label for="Input.Password" class="form-label">
                                    Password
                                </label>
                                <ValidationMessage For="() => Input.Password"
                                                   class="text-danger" />
                            </div>
                            <div class="form-floating mb-3">
                                <InputText type="password"
                                           @bind-Value="Input.ConfirmPassword"
                                           id="Input.ConfirmPassword"
                                           class="form-control"
                                           autocomplete="new-password"
                                           aria-required="true"
                                           placeholder="confirm password" />
                                <label for="Input.ConfirmPassword" class="form-label">
                                    Confirm Password
                                </label>
                                <ValidationMessage For="() => Input.ConfirmPassword"
                                                   class="text-danger" />
                            </div>
                            <div>
                                <button type="submit" class="w-100 btn btn-lg btn-primary">
                                    Register
                                </button>
                            </div>
                        </EditForm>
                    </section>
                </div>
            </div>
        }
    </NotAuthorized>
</AuthorizeView>

@code {
    private FormResult formResult = new();

    [SupplyParameterFromForm]
    private InputModel Input { get; set; } = new();

    public async Task RegisterUserAsync()
    {
        formResult = await Acct.RegisterAsync(Input.Email, Input.Password);
    }

    private sealed class InputModel
    {
        [Required]
        [EmailAddress]
        [Display(Name = "Email")]
        public string Email { get; set; } = string.Empty;

        [Required]
        [DataType(DataType.Password)]
        [Display(Name = "Password")]
        public string Password { get; set; } = string.Empty;

        [Required]
        [DataType(DataType.Password)]
        [Compare("Password")]
        [Display(Name = "Confirm Password")]
        public string ConfirmPassword { get; set; } = string.Empty;
    }
}
